<%--
  Created by IntelliJ IDEA.
  User: user
  Date: 2021/7/21
  Time: 18:42
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jstl/core" %>
<html>
    <head>
        <meta charset="utf-8">
        <title>商品</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
        <link rel="stylesheet" href="layui/css/layui.css" media="all">
        <%--<link rel="stylesheet" href="${pageContext.request.contextPath}/css/public.css" media="all">--%>
        <script src="layui/layui.js" charset="utf-8"></script>
    </head>
    <body>
        <div class="layuimini-container">
            <div class="layuimini-main">

                <div class="demoTable">
                    <div class="layui-form-item layui-form ">
                        <a href="/" class="layui_btn">返回首页                                              -</a>
                        商品信息：
                        <div class="layui-inline">
                            <input class="layui-input" name="msg" id="msg" autocomplete="off">
                        </div>
                        <button class="layui-btn" data-type="reload" lay-event="find" onclick="find()">搜索</button>
                    </div>
                </div>

                <script type="text/html" id="toolbarDemo">
                    <div class="layui-btn-container">
                        <button class="layui-btn layui-btn-normal layui-btn-sm data-add-btn" lay-event="add"> 添加 </button>
                        <button class="layui-btn layui-btn-sm layui-btn-danger data-delete-btn" lay-event="delete"> 删除 </button>
                    </div>
                </script>

                <!--表单，查询出的数据在这里显示-->
                <table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>

                <script type="text/html" id="currentTableBar">
                    <a class="layui-btn layui-btn-normal layui-btn-xs data-count-edit" lay-event="update">修改</a>
                    <a class="layui-btn layui-btn-xs layui-btn-danger data-count-delete" lay-event="delete">删除</a>
                </script>

            </div>
        </div>


        <script>
            layui.use(['form', 'table'], function () {
                var $ = layui.jquery,
                    form = layui.form,
                    table = layui.table;

                table.render({
                    elem: '#currentTableId',
                    url: '/listAllCommodity',//查询类型数据
                    toolbar: '#toolbarDemo',
                    defaultToolbar: ['filter', 'exports', 'print', {
                        title: '提示',
                        layEvent: 'LAYTABLE_TIPS',
                        icon: 'layui-icon-tips'
                    }],
                    cols: [[
                        {type: "checkbox", width: 50},
                        {field: 'c_id', width: 100, title: '商品编号'},
                        {field: 'c_name', width: 100, title: '商品名称'},
                        {field: 'c_price', width: 100, title: '商品价格'},
                        {field: 'c_type', width: 100, title: '商品类型'},
                        {field: 'c_sales', width: 100, title: '商品销售量'},
                        {field: 'c_stock', width: 100, title: '商品库存'},
                        {title: '操作', minWidth: 150, toolbar: '#currentTableBar', align: "center"}
                    ]],
                    /*limits: [10, 15, 20, 25, 50, 100],
                    limit: 15,  <!--默认显示15条-->
                    page: true,*/
                    skin: 'line',
                    id:'testReload'

                });

                var $ = layui.$, active = {
                    reload: function(){
                        var msg=$("#msg"). val();
                        console.log(name)
                        //执行重载
                        table.reload('testReload', {
                            /*page: {
                                curr: 1 //重新从第 1 页开始
                            }
                            ,*/where: {
                                msg:msg
                            },
                            url: "/findCommodityByMsg",   //请求路径
                            method: "POST"
                        }, 'data');
                    }
                };

                $('.demoTable .layui-btn').on('click', function(){
                    var type = $(this).data('type');
                    active[type] ? active[type].call(this) : '';
                });

                /**
                 * tool操作栏监听事件
                 */
                table.on('tool(currentTableFilter)', function (obj) {
                    var data=obj.data;
                    if (obj.event === 'update') {  // 监听修改操作
                        var index = layer.open({
                            title: '修改图书信息',
                            type: 2,
                            shade: 0.2,
                            maxmin:true,
                            shadeClose: true,
                            area: ['100%', '100%'],
                            content: '/toUpdateCommodity?c_id='+data.c_id,
                        });
                        $(window).on("resize", function () {
                            layer.full(index);
                        });
                    } else if (obj.event === 'delete') {  // 监听删除操作
                        layer.confirm('确定是否删除', function (index) {
                            //调用删除功能
                            deleteInfoByIds(data.c_id,index);
                            layer.close(index);
                        });
                    }
                });

                //监听表格复选框选择
                table.on('checkbox(currentTableFilter)', function (obj) {
                    console.log(obj)
                });

                /**
                 * 获取选中记录的id信息
                 */
                function getCheackId(data){
                    var arr=new Array();
                    for(var i=0;i<data.length;i++){
                        arr.push(data[i].c_id);
                    }
                    //拼接id,变成一个字符串
                    return arr.join(",");
                };


                /**
                 * 提交删除功能
                 */
                function deleteInfoByIds(ids ,index){
                    //向后台发送请求
                    $.ajax({
                        url: "/deleteCommodity",
                        type: "POST",
                        data: {cIds: ids},
                        success: function (result) {
                            if (result.code == 0) {//如果成功
                                layer.msg('删除成功', {
                                    icon: 6,
                                    time: 500
                                }, function () {
                                    parent.window.location.reload();
                                    var iframeIndex = parent.layer.getFrameIndex(window.name);
                                    parent.layer.close(iframeIndex);
                                });
                            } else {
                                layer.msg("删除失败");
                            }
                        }
                    })
                };

                /**
                 * toolbar栏监听事件
                 */
                table.on('toolbar(currentTableFilter)', function (obj) {
                    if (obj.event === 'add') {  // 监听添加操作
                        var index = layer.open({
                            title: '添加图书',
                            type: 2,
                            shade: 0.2,
                            maxmin:true,
                            shadeClose: true,
                            area: ['100%', '100%'],
                            content: '/toAddCommodity',
                        });
                        $(window).on("resize", function () {
                            layer.full(index);
                        });
                    } else if (obj.event === 'delete') {
                        /*
                          1、提示内容，必须删除大于0条
                          2、获取要删除记录的id信息
                          3、提交删除功能 ajax
                        */
                        //获取选中的记录信息
                        var checkStatus=table.checkStatus(obj.config.id);
                        var data=checkStatus.data;
                        if(data.length==0){//如果没有选中信息
                            layer.msg("请选择要删除的记录信息");
                        }else{
                            //获取记录信息的id集合,拼接的ids
                            var ids=getCheackId(data);
                            layer.confirm('确定是否删除', function (index) {
                                //调用删除功能
                                deleteInfoByIds(ids,index);
                                layer.close(index);
                            });
                        }
                    }
                });

            });
        </script>

    </body>
</html>
